<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Aruk - Multipurpose Woocommerce Store</title>
    <link rel="stylesheet" href="../../css/style.css">
    <link rel="stylesheet" href="../../font_img/font-home/iconfont.css">
    <link rel="stylesheet" href="../../css/swiper.min.css">
    <link rel="stylesheet" href="../../css/navigation.css">
    <link rel="stylesheet" href="../../css/bottom-map.css">
    <link rel="stylesheet" href="../../css/way.css">
    <link rel="stylesheet" href="../../css/banner1.css">
    <link rel="stylesheet" href="../../css/details.css">
</head>

<body>
    <div class="details">
        <div class="details-nav">
            <div class="navigation">
                <div class="container">
                    <div class="logo">
                        <a href="../../home.html">
                            <img src="../../img/logo/logo.png" alt="">
                        </a>
                    </div>
                    <div class="main-menu">
                        <ul>
                            <li>
                                <a href="../../home.html">HOME
                                    <div></div>
                                </a>


                            </li>
                            <li><a href="./shop.html">SHOP
                                    <div></div>
                                </a></li>
                            <li><a href="./collection.html">COLLECTION
                                    <div></div>
                                </a></li>
                            <li><a href="./aboutUs.html">ABOUT
                                    <div></div>
                                </a></li>
                            <li><a href="./blog.html">BLOG
                                    <div></div>
                                </a></li>
                            <li><a href="./contact.html">CONTACT
                                    <div></div>
                                </a></li>
                        </ul>
                    </div>
                    <div class="span-icon">
                        <div class="display-flex display-right">
                            <a href="./shoppingCart.html">
                                <span class="iconfont icon-tianchongxing-"></span>
                            </a>
                            <a href="#"><span class="iconfont icon-wodedangxuan"></span></a>
                        </div>
                    </div>
                </div>
            </div>

            <div class="placement">
                <span class="iconfont icon-weibajiantoushang
            "></span>
            </div>
        </div>
        <div class="details-banner">
            <div class="banner1">
                <div class="shop">
                    <div class="shop-title">
                        <div class="title-inner">
                            <h2>NEWS DETAILS</h2>
                            <div class="title-a df"> <a href="#">Home</a>
                                <span></span>
                                <a href="#">News Details</a>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 主体内容 -->
        <div class="details-main">
            <div class="details-container df">
                <div class="details-left">
                    <div class="container-left"><img src="../../img/blog/19.png" alt=""></div>
                    <h4>Mauris gravida est quis neque moles tie blandit elit.</h4>
                    <div class="df">
                        <h6>SHARE:
                        </h6>
                        <ul class="df">
                            <li><span class="iconfont icon-facebook"></span></li>
                            <li><span class="iconfont icon-twitter"></span></li>
                            <li><span class="iconfont icon-instagram"></span></li>
                            <li><span class="iconfont icon-v"></span></li>
                        </ul>
                    </div>

                    <div class="new-text">
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt
                            labo re et dolore magna
                            aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
                            ex ea commodo consequat. Duis
                            aute irure dolor in reprehenderit in voluptate ve esse cillum dolore eu fugiat nulla
                            pariatur. Excepteur sint occaecat
                            cupidatat non proident, sun culpa qui officia deserunt mollit anim id est laborum. Sed ut
                            perspiciatis unde omnis iste
                            nat error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa
                            quae ab illo inventore
                            veritatis et quasi architecto.</p>
                        <p>Beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur
                            aut odit aut fugit, sed quia
                            consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam
                            est, qui dolorem ipsum quia
                            dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt
                            ut labore et dolore magnam
                            aliquam quaerat voluptatem.</p>
                    </div>
                    <div class="news-content">
                        <p>Why I say old chap that is spiffing spend penny tosser brolly the little rotter fanny around
                            argy bargy.</p>
                        <span>ARAFAT JAMIL</span>
                    </div>
                    <div class="news-text2">
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
                            labore et dolore magna
                            aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
                            ex ea commodo consequat. Duis
                            aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
                            pariatur. Excepteur sint
                            occaecat.</p>
                    </div>
                    <!-- 轮播图 -->
                    <div class="details-swiper">
                        <div class="swiper-container">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide df">
                                    <img src="../../img/team/1.png" alt="">
                                    <div>
                                        <h6>Arafat Jamil</h6>
                                        <p>A long heritage fo the development environment with WordPress and everything
                                            related.</p>
                                    </div>
                                </div>
                                <div class="swiper-slide df">
                                    <img src="../../img/team/1.png" alt="">
                                    <div>
                                        <h6>Arafat Jamil</h6>
                                        <p>A long heritage fo the development environment with WordPress and everything
                                            related.</p>
                                    </div>
                                </div>
                                <div class="swiper-slide df">
                                    <img src="../../img/team/1.png" alt="">
                                    <div>
                                        <h6>Arafat Jamil</h6>
                                        <p>A long heritage fo the development environment with WordPress and everything
                                            related.</p>
                                    </div>
                                </div>
                            </div>
                            <!-- 如果需要分页器 -->
                            <div class="swiper-pagination"></div>

                            <!-- 如果需要导航按钮 -->
                            <div class="swiper-button-prev df"><span
                                    class="iconfont icon-jiantou-zuo"></span><span>Previous</span>
                            </div>
                            <div class="swiper-button-next df"><span class="iconfont icon-jiantou-you"></span>
                                <span>Next</span>
                            </div>

                            <!-- 如果需要滚动条 -->
                            <!--                             <div class="swiper-scrollbar"></div> -->
                        </div>
                    </div>
                    <div class="related-post">
                        <h6>Related Post</h6>
                        <div class="all-related df">
                            <div class="related-child">
                                <div> <img src="../../img/blog/7.png" alt=""></div>

                                <span>By Wpsmasher | Oct 15, 2021</span>
                                <a href="#">Nam ac elit a ante commodo Condimentum a vehicula tristique</a>
                                <li class="xiantiaoLi"><a href="#">Read More <div class="xian"></div></a>
                            </div>
                            <div class="related-child">
                                <div> <img src="../../img/blog/21.png" alt=""></div>

                                <span>By Wpsmasher | Oct 15, 2021</span>
                                <a href="#">Nam ac elit a ante commodo Condimentum a vehicula tristique</a>
                                <li class="xiantiaoLi"><a href="#">Read More <div class="xian"></div></a>
                            </div>
                            <div class="related-child">
                                <div> <img src="../../img/blog/8.png" alt=""></div>

                                <span>By Wpsmasher | Oct 15, 2021</span>
                                <a href="#">Jamu ta khamu naante commo Condimentum a vehicula tristique</a>
                                <li class="xiantiaoLi"><a href="#">Read More <div class="xian"></div></a>
                            </div>
                        </div>
                    </div>
                    <div class="blog-comment">
                        <h6>Comments (2)</h6>
                        <div class="latest-comments">
                            <ul>
                                <li>
                                    <div class="comments-box df">
                                        <div class="comments-avatar"><img src="../../img/team/2.png" alt=""></div>
                                        <div class="comments-text">
                                            <div class="comments-title df">
                                                <div class="avatar-name">
                                                    <h6>Thoman Teroman</h6>
                                                    <span>Otct 10, 2020</span>
                                                </div>
                                                <div class="replay">REPLY</div>
                                            </div>
                                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                                tempor incididunt ut labore et dolore magna
                                                aliqua.</p>

                                        </div>
                                    </div>
                                    <ul>
                                        <li>
                                            <div class="comments-box df">
                                                <div class="comments-avatar"><img src="../../img/team/3.png" alt="">
                                                </div>
                                                <div class="comments-text">
                                                    <div class="comments-title df">
                                                        <div class="avatar-name">
                                                            <h6>Thoman Teroman</h6>
                                                            <span>Otct 10, 2020</span>
                                                        </div>
                                                        <div class="replay">REPLY</div>
                                                    </div>
                                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
                                                        eiusmod
                                                        tempor incididunt ut labore et dolore magna
                                                        aliqua.</p>

                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                </li>
                                <li>
                                    <div class="comments-box df">
                                        <div class="comments-avatar"><img src="../../img/team/3.png" alt=""></div>
                                        <div class="comments-text">
                                            <div class="comments-title df">
                                                <div class="avatar-name">
                                                    <h6>Thoman Teroman</h6>
                                                    <span>Otct 10, 2020</span>
                                                </div>
                                                <div class="replay">REPLY</div>
                                            </div>
                                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                                tempor incididunt ut labore et dolore magna
                                                aliqua.</p>

                                        </div>
                                    </div>

                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="comment-sidebar">
                        <h6 class="title">Leave a Comment</h6>
                        <div class="df">
                            <div class="name"><input type="text" placeholder="Name"></div>
                            <div class="email">
                                <input type="text" placeholder="Email">
                            </div>
                        </div>
                        <div class="text">
                            <textarea name="" id="" cols="30" rows="10" placeholder="Comment"></textarea>
                        </div>
                        <div class="text-btn">
                            <div class="trendsBtn">
                                <a href="#">POST COMMENT</a>
                                <div class="trendsBtn-fize">POST COMMENT</div>
                                <div class="trendsBtn-left"></div>
                                <div class="trendsBtn-right"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="container-right">
                    <div class="search">
                        <input type="text" placeholder="Search..">
                        <span class="iconfont icon-sousuo"></span>
                    </div>
                    <div class="recent-post">
                        <h5>Recent Posts</h5>
                        <div class="post df">
                            <div class="post-img"><img src="../../img/blog/16.png" alt=""></div>
                            <div class="post-details">
                                <h6>Latest Fashion Trend</h6>
                                <p>Oct 06, 2021</p>
                            </div>
                        </div>
                        <div class="post df">
                            <div class="post-img"><img src="../../img/blog/17.png" alt=""></div>
                            <div class="post-details">
                                <h6>Decorate your house</h6>
                                <p>April 22, 2021</p>
                            </div>
                        </div>
                        <div class="post df">
                            <div class="post-img"><img src="../../img/blog/18.png" alt=""></div>
                            <div class="post-details">
                                <h6>Interior Design explained</h6>
                                <p>March 14, 2022</p>
                            </div>
                        </div>
                    </div>
                    <div class="categories">
                        <h5>Categories</h5>
                        <ul>
                            <li><a href="#">FASHION<span>(09)</span></a></li>
                            <li><a href="#">interior design<span>(09)</span></a></li>
                            <li><a href="#">electronics<span>(07)</span></a></li>
                            <li><a href="#">Uncategorized<span>(02)</span></a></li>
                            <li><a href="#">shoes<span>(04)</span></a></li>

                            <li><a href="#">House decors<span>(07)</span></a></li>

                        </ul>
                    </div>
                    <div class="tags">
                        <h5>Tags</h5>
                        <ul>
                            <li><a href="#">Interior</a></li>
                            <li><a href="#">Fashion</a></li>
                            <li><a href="#">Decor</a></li>
                            <li><a href="#">Cooling System</a></li>
                            <li><a href="#">Corporate</a></li>
                            <li><a href="#">Software</a></li>
                        </ul>
                    </div>
                    <div class="instagram">
                        <h5>Instagram</h5>
                        <div class="instagram-img">
                            <div class="img df">
                                <div class="little-img"><a href="#"><img src="../../img/instagram/13.png" alt=""></a>
                                </div>
                                <div class="little-img"><a href="#"><img src="../../img/instagram/14.png" alt=""></a>
                                </div>
                                <div class="little-img"><a href="#"><img src="../../img/instagram/15.png" alt=""></a>
                                </div>
                                <div class="little-img"><a href="#"><img src="../../img/instagram/16.png" alt=""></a>
                                </div>
                                <div class="little-img"><a href="#"><img src="../../img/instagram/17.png" alt=""></a>
                                </div>
                                <div class="little-img"><a href="#"><img src="../../img/instagram/18.png" alt=""></a>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 底部 -->
        <div class="details-map">
            <div class="bottom-map">
                <div class="bottom-map-inner width">
                    <div class="top">
                        <div class="foot-widget first">
                            <div class="logo">
                                <a href="../../home.html">
                                    <img src="../../img/logo/logo.png" alt="">
                                </a>
                            </div>
                            <ul>
                                <li>Email: <span>1965892300@qq.com</span></li>
                                <li>Phone: +137 313 19326</li>
                            </ul>
                            <p>
                                Subscribe to our newsleter and stay
                                up to date with latest offers and
                                upcoming trends.
                            </p>
                            <div class="email"> <input type="email" placeholder="Email">
                                <span class="iconfont icon-arrowRight
                    "></span>
                            </div>

                        </div>
                        <div class="foot-widget">
                            <h4>About Us</h4>
                            <ul class="allUl">
                                <li><a href="./aboutUs.html">Our Outlets
                                        <div class="xiantiao"></div>
                                    </a></li>
                                <li><a href="./aboutUs.html">Sales and Retails <div class="xiantiao"></div></a></li>
                                <li><a href="./aboutUs.html">Areas we serve <div class="xiantiao"></div></a></li>
                                <li><a href="./aboutUs.html">Career at aruk <div class="xiantiao"></div></a></li>
                                <li><a href="./contact.html">Contact Us <div class="xiantiao"></div></a></li>
                            </ul>
                        </div>
                        <div class="foot-widget">
                            <h4>Help and Support</h4>
                            <ul class="allUl">
                                <li><a href="./aboutUs.html">Track my order
                                        <div class="xiantiao"></div>
                                    </a></li>
                                <li><a href="./aboutUs.html">Our top products
                                        <div class="xiantiao"></div>
                                    </a></li>
                                <li><a href="./shoppingCart.html">My cart
                                        <div class="xiantiao"></div>
                                    </a></li>
                                <li><a href="./aboutUs.html">Sign in
                                        <div class="xiantiao"></div>
                                    </a></li>
                                <li><a href="./shippingCalculator.html">Shipping Calculator
                                        <div class="xiantiao"></div>
                                    </a></li>
                            </ul>
                        </div>
                        <div class="foot-widget last">
                            <h4>Pages & Resources</h4>
                            <ul class="allUl">
                                <li><a href="./aboutUs.html">About Us
                                        <div class="xiantiao"></div>

                                    </a></li>
                                <li><a href="./collection.html">Shop Page
                                        <div class="xiantiao"></div>

                                    </a></li>
                                <li><a href="./collection.html">Category page
                                        <div class="xiantiao"></div>

                                    </a></li>
                                <li><a href="./aboutUs.html">Sign in page
                                        <div class="xiantiao"></div>

                                    </a></li>
                                <li><a href="./404.html">404 page
                                        <div class="xiantiao"></div>

                                    </a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="bottom-out">
                    <div class="bottom">
                        <div class="copyright">
                            <p>Copyright © 2020 | Designed by <span>Wpsmasher</span></p>
                        </div>
                        <div class="social-icon">
                            <ul>
                                <li><a href="#"><span class="iconfont icon-facebook"></span></a></li>
                                <li><a href="#"><span class="iconfont icon-twitter"></span></a></li>
                                <li><a href="#"><span class="iconfont icon-instagram"></span></a></li>
                                <li><a href="#"><span class="iconfont icon-v"></span></a></li>
                            </ul>
                        </div>
                        <div class="policy">
                            <p class="first">Terms of Use</p>
                            <p>Privacy Policy</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="../../js/navigation.js"></script>
    <script src="../../js/swiper.min.js"></script>
    <script src="../../js/bottom-map.js"></script>
    <script src="../../js/way.js"></script>
    <script src="../../js/details.js"></script>
</body>

</html>